<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <style>
    /*日间模式*/
    .light{
      color: black;
      background-color: white;
    }
    .dark{
      color: white;
      background-color: black;
    }
  </style>
</head>
<body>
<!-- 实现"夜间模式"" -->
<div class="light">
  这是一段话，Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur ipsum, eum nemo tempora vel dolorem est laborum cum repellat labore soluta vitae, inventore earum at voluptatum nisi distinctio, voluptates adipisci!
  这是一段话，Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur ipsum, eum nemo tempora vel dolorem est laborum cum repellat labore soluta vitae, inventore earum at voluptatum nisi distinctio, voluptates adipisci!
  这是一段话，Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur ipsum, eum nemo tempora vel dolorem est laborum cum repellat labore soluta vitae, inventore earum at voluptatum nisi distinctio, voluptates adipisci!
  这是一段话，Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur ipsum, eum nemo tempora vel dolorem est laborum cum repellat labore soluta vitae, inventore earum at voluptatum nisi distinctio, voluptates adipisci!
  这是一段话，Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur ipsum, eum nemo tempora vel dolorem est laborum cum repellat labore soluta vitae, inventore earum at voluptatum nisi distinctio, voluptates adipisci!
</div>
<script>
  let div = document.querySelector('div');
  div.onclick = function(){
    if(div.className == 'light'){
      div.className = 'dark';

    }else{
      div.className = 'light';
    }
  }
</script>
</body>
</html>